<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>表单练习</title>
		引入外部第三方css文件
		<!-- .min意思最小文件 压缩（把文件所有内容换行和空格） -->
		<link rel="stylesheet" href="css/bootstrap.min.css"/>
	</head>
	<body>
		<div class="container">
			<h1>学生信息管理系统</h1>
			<div class="form-group">
				
				<!-- lable标签for属性光标定位 -->
				<label for="name">姓名:</label>
				<!-- h5新特性placeholder -->
				<input type="text" name="name" id="name" 
				class="form-control"
				placeholder="请输入姓名..." value="陈"/>				
			</div>
			<div class="form-group">
				<label for="age">年龄:</label>
				<input type="number" name="age"
				class="form-control"
				 id="age" placeholder="请输入年龄..."/>
			</div>
			<div class="form-group">
				<label class="radio-inline">性别:</label>
				<div class="radio-inline">
					<input type="radio" name="sex"
					 id="sex" checked="checked"/>男
					
					 
				</div>
				<div class="radio-inline">
					<input type="radio" name="sex"
					id="sex"/>女
				</div>
				
			</div>
			<div class="form-group">
				<label for="hobby">爱好:{多选}</label>
				<div class="checkbox-inline">
					<input type="checkbox"  name="hobby"
					id="hobby" checked="checked"/>乒乓球
				</div>
				<div class="checkbox-inline">
					<input type="checkbox" name="hobby"
					 id="hobby"/>爬山
				</div>
				<div class="checkbox-inline">
					<input type="checkbox" name="hobby"
					 id="hobby"/>唱歌
				</div>	
			</div>
			
			<div class="form-group">
				<label>学历:{下拉框}</label>
				<select name="edu" id="edu">
					<option value="1">幼儿园</option>
					<option value="2">小学</option>
					<option value="3">初中</option>
					<option value="4">高中</option>
					<option value="5" selected="selected">大学</option>
					<option value="6">研究生</option>
					<option value="7">博士</option>
				</select>
			</div>
			<div class="form-group">
				<!-- class属性支持多个样式，样式之间空格隔开 -->
				<input class="btn btn-primary" type="button" name="submit"
				 value="保存"/>
				 <button class="btn btn-danger" name="clear">取消</button>
			</div>
			
		</div>
	</body>
</html>
